import React from 'react';
import ProCard from '@ant-design/pro-card';
import ProTable, { ProColumns } from '@ant-design/pro-table';
import styles from '../index.less';
import { getSales } from '@/services/aqchain-antd/trade';
import moment from 'moment';
import { useModel } from '@@/plugin-model/useModel';

const SaleHistoryCard: React.FC = () => {

  // 全局变量
  const { initialState } = useModel('@@initialState');
  if(!initialState){
    return <div/>
  }
  // 页面变量
  const {item,owner,tokenId,sale,loading,responsive} = useModel('item');
  const { currentAccount,provider,contracts:{saleContract} } = initialState;

  if(!item){
    return <div/>
  }

  const valueEnum = {
    0: '创建',
    1: '转让',
    2: '定价',
    3: '交易',
    4: '授权定价',
    5: '授权',
    6: '拍卖定价',
    7: '交易',
    8: '报价',
    9: '取消交易',
  };

  const columns: ProColumns<API.ModelsSale>[] = [
    {
      title: '序号',
      valueType: 'index',
    },
    {
      title: '类型',
      dataIndex: 'type',
    },
    {
      title: '发起方',
      render: (_, record) => {
        return record.seller;
      },
    },
    {
      title: '接收方',
      render: (_, record) => {
        return record.buyer;
      },
    },
    {
      title: '价格',
      dataIndex: 'price',
    },
    {
      title: '创建时间',
      render: (_, record) => {
        return moment.unix(record.block?.time!).format('YYYY-MM-DD HH:mm:ss');
      },
    },
  ];

  return (
    <ProCard
      className={styles.itemCard}
      headerBordered
      bordered
      title="定价出售操作记录"
      loading={loading}
    >
      <ProTable<API.ModelsSale, { fileHash: string }>
        bordered
        rowKey="id"
        options={false}
        search={false}
        columns={columns}
        params={{ fileHash: item.fileHash! }}
        request={(params, sorter, filter) => getSales(params)}
      />
    </ProCard>
  );
};

export default SaleHistoryCard;
